﻿
/* Parametry produktu pro mobil na stred */
/* Výchozí styl pro desktop */
table {
    width: 100%;
    border-collapse: collapse; /* Odstranění mezer mezi buňkami */
}

table th,
table td {
    text-align: left;
    padding: 5px;
}

/* Styl pro mobilní zařízení */
@media (max-width: 767px) {
    table {
        margin: 0 auto; /* Vycentrování tabulky */
    }

    table th,
    table td {
        text-align: center; /* Zarovnání textu na střed */
        display: block; /* Zobrazení buněk jako blok */
        width: 100%; /* Každá buňka zabere plnou šířku */
    }

    table th {
        font-weight: bold; /* Zvýraznění záhlaví */
        margin-bottom: 5px; /* Mezera pod záhlavím */
    }

    table td {
        border-top: 1px solid #ccc; /* Oddělení buněk */
    }
}

table tr:hover {
    background-color: #f9f9f9; /* Zvýraznění řádku při najetí */
    transition: background-color 0.3s ease; /* Hladký přechod */
}


/* Produkty se zvetsi */
/* Přidání přechodu pro obrázky v kategoriích a produktech */
.subcategories .image img,
.products .img img {
    transition: transform 0.3s ease; /* Hladký přechod při změně velikosti */
    display: block; /* Zabrání případným problémům s inline obrázky */
}

/* Efekt při najetí myší */
.subcategories .image img:hover,
.products .img img:hover {
    transform: scale(1.2); /* Zvětší obrázek o 20 % */
}


/* ZÁPATÍ */
#footer {
    background-color: white; /* Barva pozadí */
    color: black; /* Barva textu */
    background-size: cover; /* Obrázek pokryje celý prostor */
    background-repeat: no-repeat; /* Zabrání opakování obrázku */
    background-position: center; /* Umístění obrázku na střed */
    position: relative; /* Zajištění správného vrstvení */
    z-index: 1; /* Zajištění správného z-indexu */
}

/* Odkazy v zápatí */
#footer a {
    color: #0088bf; /* Správný formát barvy odkazu (hexadecimální s #) */
    text-decoration: none; /* Odstraní podtržení pro čistý vzhled */
    transition: transform 0.3s ease, color 0.3s ease; /* Hladká animace */
}

#footer a:hover {
    color: #006f9e; /* Tmavší odstín modré při hover */
    transform: scale(1.1); /* Zvětší odkaz o 10 % */
}

/* #footer:hover { */
/*    background-color: #f9f9f9; /* Mírná změna barvy pozadí */
/*    transition: background-color 0.3s ease; */
/* } */

@media (max-width: 768px) {
    #footer {
        text-align: center; /* Zarovnání textu na střed na mobilu */
        padding: 20px; /* Zvýšení paddingu pro lepší čitelnost */
    }
}

